<?php echo Modules::run('common/header') ?>

<script src="<?php echo base_url();?>assets/js/ckeditor.js"></script>

<!-- Begin page content -->
<div class="container content-body">

	<div id="message"></div>

	<?php
	$product_name = array(
		'name'	=> 'product_name',
		'id'	=> 'product_name',
		'value' => set_value('product_name', $product_name),
		'class' => 'input-xxlarge',
		);

	$description = array(
		'name'	=> 'description',
		'id'	=> 'description',
		'value' => set_value('description', $description),
		'class' => 'ckeditor',
		);

	$price = array(
		'name'	=> 'price',
		'id'	=> 'price',
		'value' => set_value('price', $price),
		'class' => 'input-medium',
		);

	$tags = array(
		'name'	=> 'tags',
		'id'	=> 'tags',
		'value' => set_value('tags', $tags),
		'class' => 'input-xlarge',
		'placeholder'=>"Monitor, Fashion, etc"
		);

	$quantity = array(
		'name'	=> 'quantity',
		'id'	=> 'quantity',
		'value' => set_value('quantity', $quantity),
		'class' => 'input-mini',
		);

	$weight = array(
		'name'	=> 'weight',
		'id'	=> 'weight',
		'value' => set_value('weight', $weight),
		'class' => 'input-mini',
		);

	$length = array(
		'name'	=> 'length',
		'id'	=> 'length',
		'value' => set_value('length', $length),
		'class' => 'input-mini',
		'placeholder'=>"Length"
		);

	$width = array(
		'name'	=> 'width',
		'id'	=> 'width',
		'value' => set_value('width', $width),
		'class' => 'input-mini',
		'placeholder'=>"Width"
		);

	$height = array(
		'name'	=> 'height',
		'id'	=> 'height',
		'value' => set_value('height', $height),
		'class' => 'input-mini',
		'placeholder'=>"Height"
		);
		?>

		<?php echo form_open_multipart($this->uri->uri_string(),' name="formp" id="" class="form-horizontal"'); ?>

		<legend><h2>Product</h2></legend>

		<input type="hidden" name="product_id" value="<?php echo $product_id;?>">		

		<ul class="nav nav-tabs" id="myTab">
			<li class="active"><a href="#home">Data</a></li>
			<li><a href="#shipping">Shipping</a></li>
		</ul>

		<div class="tab-content">
			<div class="tab-pane active" id="home">


				<div class="control-group">
					<label class="control-label" for="product_name">Product Name <span style="color: red;">*</span></label>
					<div class="controls">
						<?php echo form_input($product_name); ?> <?php echo form_error($product_name['name']); ?>
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="image_file">Image </label>
					<div class="controls">              	

						<div id="image_file" style="display:<?php echo $image_file != '' ? 'block': 'none'; ?>">                
							<input type="hidden" name="image_file_name" value="<?php echo $image_file; ?>">
							<img src="<?php echo base_url('data/thumb/'.$image_file)?>" class="img-polaroid">
							<a class="btn" style="cursor:pointer;" onclick="clear_image();" title="Clear Image"><i class="icon-trash"></i> Hapus</a>

						</div>

						<div id="logo_input" style="display:<?php echo $image_file == '' ? 'block': 'none'; ?>">
							<input type="file" name="image_file" title="Browse File">
							<input type="hidden" name="del_i" value="0">
						</div>

					</div>
				</div>
				<hr>	    	

				<div class="control-group">
					<label class="control-label" for="description">Description <span style="color: red;">*</span></label>
					<div class="controls">
						<div style="width:700px;float:left;">
							<?php echo form_textarea($description); ?> 
						</div>
						<?php echo form_error($description['name']); ?>
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="price">Price <span style="color: red;">*</span></label>
					<div class="controls">
						<?php echo form_input($price); ?> <?php echo form_error($price['name']); ?>
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="quantity">Quantity <span style="color: red;">*</span></label>
					<div class="controls">
						<?php echo form_input($quantity); ?> <?php echo form_error($quantity['name']); ?>
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="subtract_stock">Subtract Stock </label>
					<div class="controls">
						<?php echo form_dropdown('subtract_stock',$list_subtract_stock, set_value('subtract_stock', $subtract_stock)); ?> <?php echo form_error('subtract_stock'); ?>              

					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="status">Status</label>
					<div class="controls">
						<?php echo form_dropdown('status',$list_status, set_value('status', $status)); ?> <?php echo form_error('status'); ?>              
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="category_id">Category</label>
					<div class="controls">
						<select name="category">
							<option value="">-- Select --</option>
							<?php foreach ($list_category as $key => $val) { ?>

							<optgroup label="<?php echo $val->category_name; ?>">				    	

								<?php 
								$category = $this->manager_model->get_category_child($val->category_id); 

								foreach ($category as $keyc => $valc) {

									echo '<option value="'.$valc->category_id.'" '. ($category_id == $valc->category_id ? "selected=''":"") .'>'.$valc->category_name.'</option>';
								}
								?>

							</optgroup>
							<?php } ?>
						</select>

						<?php //echo form_dropdown('category',$list_category, set_value('category', $category_id)); ?> <?php echo form_error('category'); ?>              

					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="tags">Tags</label>
					<div class="controls">
						<?php echo form_input($tags); ?> <?php echo form_error($tags['name']); ?>
					</div>
				</div>
				<hr>

				<div class="control-group">
					<label class="control-label" for="option_id">Option</label>
					<div class="controls">
						<div class="op-button">
							<a class="btn btn-small" style="cursor:pointer;" onclick="addProductOption()"><i class="icon-plus"></i> Add Product Option</a>
						</div>

						<div class="op-text-input" style="display:none;margin:10px 0;">
							<input type="text" name="op_text" value="" class="input-xlarge">
							<a class="btn btn-small" style="cursor:pointer;" onclick="addOptionValue()">Add</a>
							<a class="btn btn-small" style="cursor:pointer;" onclick="removeFormAddOptionValue()">Cancel</a>
						</div>

						<div class="op-content"></div>

						<div style="margin:10px 0;">
							<?php foreach ($product_options as $key => $val) : ?>

							<div class="op-option-edit<?php echo $key; ?>">

								<input type="hidden" name="<?php echo strtolower(str_replace(' ', '', $val['data']['option_name'])); ?>" value="1">              			

								<table id="table-option-edit<?php echo $key; ?>" class="table table-bordered">
									<thead>
										<tr>
											<th>Option</th>
											<th>Option Value</th>
											<th>Quantity</th> 
											<th>Subtract Stock</th> 
											<th>Price</th> 
											<th></th>
										</tr> 
									</thead>
									<tbody>

										<?php foreach ($val['option'] as $key_op => $val_op) :?>

										<tr id="option-edit<?php echo $key.'-'.$key_op; ?>">
											<td><?php echo $val_op->option_name; ?> 
												<input type="hidden" name="option[edit<?php echo $key.'-'.$key_op; ?>][product_option_id]" value="<?php echo $val_op->product_option_id; ?>" id="option-edit<?php echo $key.'-'.$key_op;?>-value">
												<input type="hidden" name="option[edit<?php echo $key.'-'.$key_op; ?>][value]" value="<?php echo $val['data']['option_name']; ?>">
											</td>
											<td><input type="text" name="option[edit<?php echo $key.'-'.$key_op; ?>][option_value]" value="<?php echo $val_op->option_value; ?>"></td>
											<td><input type="text" name="option[edit<?php echo $key.'-'.$key_op; ?>][option_qt]" value="<?php echo $val_op->quantity; ?>" class="input-mini"></td>
											<td>
												<select name="option[edit<?php echo $key.'-'.$key_op; ?>][option_st_stock]" style="width:75px;">
													<option value="1">Yes</option> 
													<option value="0">No</option>
												</select>
											</td>
											<td><input type="text" name="option[edit<?php echo $key.'-'.$key_op; ?>][option_price]" value="<?php echo $val_op->price; ?>" class="input-medium"></td>
											<td>
												<a class="btn btn-small btn-danger" style="cursor:pointer;" onclick="removeOptionValue('option-edit<?php echo $key;?>',<?php echo $key_op;?>)">Remove</a>

											</td>
										</tr>

									<?php endforeach; ?>

									<tr id="del-option-edit<?php echo $key;?>--1">
										<td colspan="5"></td>
										<td>
											<a class="btn btn-small" style="cursor:pointer;" onclick="addNewOptionValueEdit('option-edit<?php echo $key; ?>','<?php echo $val['data']['option_name']; ?>',this,<?php echo count($val['option']);?>)">Add Option Value</a> 
										</td>
									</tr>


								</tbody>
							</table>
						</div>

					<?php endforeach; ?>
				</div>

				<div id="option-del-content" style="display:none"></div>

			</div>
		</div>
		<hr>

		<div class="control-group">
			<label class="control-label" for="weight">Weight</label>
			<div class="controls">
				<?php echo form_input($weight); ?> <?php echo form_error($weight['name']); ?>
			</div>
		</div>
		<hr>

		<div class="control-group">
			<label class="control-label" for="weight_class">Weight Class </label>
			<div class="controls">
				<?php echo form_dropdown('weight_class',$list_weight_class, set_value('weight_class', $weight_class)); ?> <?php echo form_error('weight_class'); ?>              

			</div>
		</div>
		<hr>	    	

		<div class="control-group">
			<label class="control-label" for="length">Dimensions (L x W x H): </label>
			<div class="controls">
				<?php echo form_input($length); ?> x 
				<?php echo form_input($width); ?> x 
				<?php echo form_input($height); ?>
				<br>
				<?php echo form_error($height['name']); ?>
				<?php echo form_error($length['name']); ?> 
				<?php echo form_error($width['name']); ?> 
			</div>
		</div>
		<hr>

		<div class="control-group">
			<label class="control-label" for="length_class">Length Class</label>
			<div class="controls">
				<?php echo form_dropdown('length_class',$list_length_class, set_value('length_class', $length_class)); ?> <?php echo form_error('length_class'); ?>              

			</div>
		</div>
		<hr>	   	
	</div>

	<div class="tab-pane" id="shipping">
		<button type="button" class="btn btn-info shipping_form">Add Shipping Method</button> 

		<div id="message-shipping"></div>

		<div class="shipping_form_data" style="display:none; margin:15px 0;">

			<div class="control-group">
				<label class="control-label" for="shipping_method">Shippin Method</label>
				<div class="controls">	                
					<input type="text" name="" id="shipping_method">
				</div>
			</div>
			<hr>

			<div class="control-group">
				<label class="control-label" for="area">Area</label>
				<div class="controls">
					<input type="text" name="" id="area">
				</div>
			</div>
			<hr>

			<div class="control-group">
				<label class="control-label" for="cost">Cost</label>
				<div class="controls">
					<input type="text" name="" id="cost">
				</div>
			</div>
			<hr>

			<button type="button" class="btn add_shipping_method">Add</button> 

		</div>


		<div id="shipping_data" style="margin:10px 0;">
			<table id="shipping_data_content" class="table">
				<tr>
					<th>Shipping Method</th>
					<th>Area</th>
					<th>Cost</th>
					<th>Action</th>
				</tr>

				<?php foreach ($shipping_method as $key => $val) { ?>

				<tr id="<?php echo $val['shipping_id'];?>">
					<td><?php echo $val['shipping_method']; ?></td>
					<td><?php echo $val['location']; ?></td>
					<td><?php echo $val['price']; ?></td>
					<td><a id="hapus_shipping" href="javascript:delete_shipping(<?php echo $val['shipping_id']; ?>);" onclick="return confirmDelete();">Delete</a></td>
				</tr>

				<?php } ?>

				<?php foreach ($session_shipping_method as $key => $val) { ?>
				
				<tr id="<?php echo $key;?>">
					<td><?php echo $val['shipping_method']; ?></td>
					<td><?php echo $val['location']; ?></td>
					<td><?php echo $val['price']; ?></td>
					<td><a id="hapus_shipping" href="javascript:delete_shipping_session('<?php echo $key; ?>');" onclick="return confirmDelete();">Delete</a></td>
				</tr>

				<?php } ?>

			</table>
		</div>




		<hr>

	</div>

</div>

<button type="submit" class="btn btn-primary">Submit</button> 

<?php echo form_close(); ?>

</div>
<script type="text/javascript">

function clear_image(){
	$("#image_file").hide();
	$("#logo_input").show();
	$("input[name=del_i]").val('1');
	
}

function addProductOption(){
	//$('.op-button').hide();
	
	$('.op-text-input').show();
	document.formp.op_text.focus();
	
}

var op_number = 0;

function addOptionValue(){

	value = $.trim($('input[name=op_text]').val());

	newValue = value.replace(/\s+/g, '').toLowerCase();

	console.log(newValue);

	if ($('input[name='+newValue+']').val() == '1'){
		alert('Option has already exist.');
		return false;
	}

	$('input[name=op_text]').val('');

	if (value != ''){

		id = 'option'+op_number;

		content = '<div class="op-'+id+'">';
		content += '<input type="hidden" name="'+newValue+'" value="1">';
		content += '<input type="hidden" name="option['+op_number+'][value]" value="'+value+'">';
		content += '<table id="table-'+id+'" class="table table-bordered">';
		content += '<thead><tr><th>Option</th><th>Option Value</th><th>Quantity</th> <th>Subtract Stock</th> <th>Price</th> <th></th></tr> </thead>';
		content += '<tbody><tr id="'+id+'-'+op_number+'">';

		content += '<td>'+value+'</td>';
		content += '<td><input type="text" name="option['+op_number+'][option_value]" value="" id="set-'+newValue+'"></td>';
		content += '<td><input type="text" name="option['+op_number+'][option_qt]" value="" class="input-mini"></td>';
		content += '<td><select name="option['+op_number+'][option_st_stock]" style="width:75px;"><option value="1">Yes</option> <option value="0">No</option></select></td>';
		content += '<td><input type="text" name="option['+op_number+'][option_price]" value="" class="input-medium"></td>';
		content += '<td><a class="btn btn-small btn-danger" style="cursor:pointer;" onclick="removeOptionValue('+"'"+id+"'"+','+op_number+')">Remove </a> </td>';
		content += '</tr>'


		content += '<tr id="del-'+id+'-'+op_number+'"><td colspan="5"></td><td><a class="btn btn-small" style="cursor:pointer;" onclick="addNewOptionValue('+"'"+id+"'"+','+"'"+value+"'"+',this,'+op_number+')">Add Option Value</a> </td></tr>';
		content += '</tbody></table>';
		content += '</div>';

		$('.op-content').append(content);
		$('input[name=op-text]').val('');

		op_number = op_number + 1;

	}

}

function addNewOptionValue(id,value,dom,number){

	$(dom).hide();
	//console.log(number);
	$('.remove-value'+number).show();

	var numberDel = '#del-'+id+'-'+number;
	console.log(numberDel);
	$(numberDel).remove();

	content = '<tr id="'+id+'-'+op_number+'"><td>'+value+'<input type="hidden" name="option['+op_number+'][value]" value="'+value+'"></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_value]" value=""></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_qt]" value="" class="input-mini"></td>';
	content += '<td><select name="option['+op_number+'][option_st_stock]" style="width:75px;"><option value="1">Yes</option> <option value="0">No</option></select></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_price]" value="" class="input-medium"></td>';
	content += '<td><a class="btn btn-small btn-danger" style="cursor:pointer;" onclick="removeOptionValue('+"'"+id+"'"+','+op_number+')">Remove</a> </td>';
	content += '</tr>';

	content += '<tr id="del-'+id+'-'+op_number+'">';
	content += '<td colspan="5"></td>';
	content += '<td><a class="btn btn-small" style="cursor:pointer;" onclick="addNewOptionValue('+"'"+id+"'"+','+"'"+value+"'"+',this,'+op_number+')">Add Option Value</a> </td>';
	content += '</tr>';

	$('#table-'+id+' > tbody:last').append(content);
	op_number = op_number + 1;
}

function addNewOptionValueEdit(id,value,dom,number){

	$(dom).hide();
	//console.log(number);
	$('.remove-value'+number).show();

	var newNumber = number + 1;

	var newOp_numbe = op_number - 1;

	var numberDel = '#del-'+id+'-'+newOp_numbe;
	console.log(numberDel);
	$(numberDel).remove();
	$('#del-option').remove();

	content = '<tr id="'+id+'-'+number+'"><td>'+value+'<input type="hidden" name="option['+op_number+'][value]" value="'+value+'"></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_value]" value=""></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_qt]" value="" class="input-mini"></td>';
	content += '<td><select name="option['+op_number+'][option_st_stock]" style="width:75px;"><option value="1">Yes</option> <option value="0">No</option></select></td>';
	content += '<td><input type="text" name="option['+op_number+'][option_price]" value="" class="input-medium"></td>';
	content += '<td><a class="btn btn-small btn-danger" style="cursor:pointer;" onclick="removeOptionValue('+"'"+id+"'"+','+op_number+')">Remove</a> </td>';
	content += '</tr>';

	content += '<tr id="del-'+id+'-'+op_number+'">';
	content += '<td colspan="5"></td>';
	content += '<td><a class="btn btn-small" style="cursor:pointer;" onclick="addNewOptionValueEdit('+"'"+id+"'"+','+"'"+value+"'"+',this,'+newNumber+')">Add Option Value</a> </td>';
	content += '</tr>';

	$('#table-'+id+' > tbody:last').append(content);
	op_number = op_number + 1;
}

function removeOptionValue(id,number){

	var idText = "#"+id+"-"+number+"-value";

	var product_option_id = $(idText).val();
	console.log(idText);

	var delHtml = '<input type="hidden" name="op_del_value[]" value="'+product_option_id+'">';
	console.log(delHtml);

	$("#option-del-content").append(delHtml);


	$('#'+id+'-'+number).remove();

	if ($('#table-'+id+' tr').length == 2)
		$('#table-'+id).remove();	

}

function removeFormAddOptionValue(){
	$('.op-text-input').hide();
}

$('input[name=op_text]').keypress(function(e) {
	if(e.which == 13) {

		value = $.trim($('input[name=op_text]').val());

		newValue = value.replace(/\s+/g, '').toLowerCase();

		console.log(newValue);

		if ($('input[name='+newValue+']').val() == '1'){
			alert('Option has already exist.');
			return false;
		}

		addOptionValue();
		return false;
	}
});
</script>

<script>
$(function () {
	$('#myTab a').click(function (e) {
		e.preventDefault();
		$(this).tab('show');
	});

	$('.shipping_form').click(function(){
		$('.shipping_form_data').show();
		$(this).hide();
	});

	area_url = window.site_url+'manager/shipping/get_area';

	$('#area').typeahead({
    source: function (query, process) {
        return $.get(area_url, { query: query }, function (data) {
            return process(data.options);
        });
    }
	});

	$('.add_shipping_method').click(function(){
		//console.log('add');
		product_id = '<?php echo $product_id;?>';
		shipping_method = $('#shipping_method').val();
		area = $("#area").val();
		cost = $("#cost").val();
		validation_url = window.site_url+'manager/shipping/validation/<?php echo $product_id;?>';

		
		var request = $.ajax({
			url: validation_url,
			type: "POST",
			dataType: 'json',
			data: {product_id:product_id,shipping_method:shipping_method,area:area,cost:cost}
		});

		request.done(function(data) {
			if(data.message == 'success'){
				$('#message-shipping').html('');
				$('.shipping_form_data').hide();
				$('.shipping_form').show();

				$('#shipping_method').val('');
				$("#area").val('');
				$("#cost").val('');

				shipping_content = '<tr id="'+data.id+'"><td>'+ shipping_method +'</td>';
				shipping_content += '<td>'+ area +'</td>';
				shipping_content += '<td>'+ cost +'</td>';
				shipping_content += '<td><a id="hapus_shipping" href="javascript:delete_shipping_session('+"'"+data.id+"'"+');" onclick="return confirmDelete();">Delete</a></td></tr>';
				
				$('#shipping_data_content tr:last').after(shipping_content);

			}
			else{
				$('#message-shipping').html(msg);
			}

		});

		request.fail(function(jqXHR, textStatus) {
			alert( "Request failed: " + textStatus );
		});
	});

});

function delete_shipping(id){
	shipping_id = id;
	product_id = '<?php echo $product_id;?>';
	url = window.site_url+'manager/shipping/delete';

	var request = $.ajax({
		url: url,
		type: "POST",
		data: {shipping_id:shipping_id,product_id:product_id}
	});

	request.done(function(msg) {
		if(msg == 'success'){
			$('#message-shipping').html('');
			$('.shipping_form_data').hide();
			alert('Data successfully deleted!');
			$('#'+id).remove();
		}
		else{
			alert('Deleted data failed!');
		}
	});

	request.fail(function(jqXHR, textStatus) {
		alert( "Request failed: " + textStatus );
	});
}

function delete_shipping_session(id){
	shipping_id = id;
	product_id = '<?php echo $product_id;?>';
	url = window.site_url+'manager/shipping/delete_shipping_session/';

	var request = $.ajax({
		url: url,
		type: "POST",
		data: {shipping_id:shipping_id}
	});

	request.done(function(msg) {
		if(msg == 'success'){
			$('#'+id).remove();
		}
		else{
			alert('Deleted data failed!');
		}
	});

	request.fail(function(jqXHR, textStatus) {
		alert( "Request failed: " + textStatus );
	});
}

</script>

<?php echo Modules::run('common/footer') ?>